<template>
    <div class="Phone">
        <ul>
            <li>
                <input type="text" placeholder="请输入手机号" id="phone">
            </li>
            <li>
                <input type="password" placeholder="请输入密码" id="password">
            </li>
            <li>
                <input type="checkbox" id="box">
                <label for="box">自动登录</label>
            </li>
            <li>
                <button @click="LogIn">登录</button>
            </li>
            <li>
                <input type="checkbox" id="agree">
                <p>同意
                    <a href="https://st.music.163.com/official-terms/service">《服务条款》</a>
                    <a href="https://st.music.163.com/official-terms/privacy">《隐私政策》</a>
                    <a href="https://st.music.163.com/official-terms/children">《儿童隐私政策》</a>
                </p>
            </li>
        </ul>
    </div>
</template>

<script>
import {
    loginCellphone,
    LoginRefresh,
    LoginStatus
} from '@/library/api/api'
export default {
    name:'Phone',
    data() {
        return {
            phone:'',
            password:'',
            n:false,
            userName:"点击登录",
            userAva:"",
        }
    },
    methods: {
        Status() {
            LoginStatus({
                data: {
                    cookie:localStorage.cookie
                }
            }).then(res=>{
                console.log(res);
            })
        },
        LogIn() {
            this.phone = document.getElementById('phone').value
            this.password = document.getElementById('password').value
            let agree = document.getElementById('agree')
            if(agree.checked === true) {
                loginCellphone({
                    data: {
                        phone:this.phone,
                        password:this.password,
                        cookie:this.cookie
                    }
                }).then(res=>{
                    // console.log(res);
                    location.reload();
                    this.userName = res.profile.nickname
                    this.userAva = res.profile.avatarUrl
                    this.$emit('userName',this.userName)
                    this.$emit('userAva',this.userAva)
                    localStorage.cookie = res.cookie
                    localStorage.uid = res.profile.userId
                    LoginRefresh({
                        data: {
                            cookie:res.cookie
                        }
                    }).then(res=>{
                        // console.log(res);
                        if(res.code=="200") {
                            this.Status()
                            this.$emit('close',this.n)
                        }
                        
                    })
                    alert("登录成功")
                })
            }else {
                alert("请同意相关协议")
            }
        },
    },
    created() {
        this.Status()
    }
}
</script>

<style lang="scss" scoped>
@import './Phone.scss'
</style>
